<section class="application-header hidden-xs">
  <div class="container">
      <div class="row">
        <div class="col-sm-4 logo first-col">
          <a href="<%= root_path %>">
            <i class="icon-logo" style="font-size: 45px;"></i>
          </a>
          <img src="<%= image_path('ac/home-head-gif.gif') %>" alt="">
        </div>

        <div class="col-sm-4">
          <autocomplete-input :options="options" @select="onOptionSelect">
              <template slot="item" scope="option">
                  <article class="media">
                    {{ option.title }}
                  </article>
              </template>
          </autocomplete-input>
          <a href="/products?category_id=2"><small class="text-gray-new">封阳台</small></a>
          <a href="/products?category_id=3"><small class="text-gray-new">卧室窗</small></a>
          <a href="/products?category_id=4"><small class="text-gray-new">厨卫窗</small></a>
          <a href="/products?category_id=6"><small class="text-gray-new">阳光房</small></a>
        </div>

        <div class="col-sm-offset-1 col-sm-3 last-col">
          <div class="row">
            <div class="<%= current_user ? 'col-sm-9' : 'col-sm-6'%> text-center col-item">
              <a href="/carts" class="text-green pull-right cart-link">
                  <i class="icon-home-gouwuche"></i>
                  <%= @cart_count %>
              </a>
            </div>

            <% if current_user %>
              <div class="col-sm-3 text-right col-item dropdown">
                  <a class="" href="#" data-jq-dropdown="#jq-dropdown-1">
                    <img src="<%= image_path('touxiang.png') %>" class="header-logo" alt="">
                    <span class="caret"></span>
                  </a>
              </div>
            <% else %>
              <div class="col-sm-3 text-center col-item"><a href="/sign_in" class="text-dark">登录</a></div>
              <div class="col-sm-3 text-center col-item"><a href="/sign_up" class="text-dark">注册</a></div>
            <% end %>
          </div>
        </div>
      </div>
  </div>
</section>
